<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<script type="text/javascript" charset="utf-8" src="../../d3/d3.min.js"></script>
	<script type="text/javascript" charset="utf-8" src="../../jquery/jquery.min.js"></script>
	
	<style type="text/css">
	body { 
		background-color: white; 
		margin: 20px;
	}
	
	#createdBy {
		width: 120px; 
		height: 15px; 
		position: fixed;
		right: 10;
		bottom: 10;
		font-size: 11px;
	}
	
	#createdBy a { 
		color: #4F4F4F; 
		text-decoration: none; 
		outline: none;
	}
	
	#createdBy a:hover {
		color: #1E90FF;
		text-decoration: none;
	}
	
	.topBar {
		display: flex;
		flex-direction: row;
		font-size: 14px;
	}
	
	.topBarItem {
		margin-right: 40px;
	}
	
	.filterBar {
		display: flex;
		flex-direction: row;
		padding-top: 20px;
		padding-left: 50px;
	}
	
	#filterTable {
		width: 300px;
		margin-right: 580px;
	}
	
	#filterXSQL {
		width: 600px;
	}
	</style>
</head>
<body oncontextmenu="return false">

	<div class="topBar">
		<div class="topBarItem">
			数据连接池组：
			<select id="DSGIDs"></select>
		</div>
		
		<div class="topBarItem">
			排序规则：
			<select id="OrderType">
				<option value="1">按名称</option>
				<option value="2">按关系权重</option>
			</select>
		</div>
		
		<div class="topBarItem">
			<a href="#" id="helpMe">帮助</a>
		</div>
	</div>
	
	<div class="filterBar">
		<input type="text" id="filterTable" onKeyUp="filterTableOnKeyUp(event);" placeholder="过滤表名称。回车过滤">
		<input type="text" id="filterXSQL"  onKeyUp="filterXSQLOnKeyUp(event);"  placeholder="过滤XSQL。回车过滤">
	</div>

	<svg width="100%" height="100%" version="1.1" xmlns="http://www.w3.org/2000/svg">
	</svg>
	
	<div id="createdBy">
		<a href="https://github.com/HY-ZhengWei/XJava" target="_brank">Source code by <b>XSQL</b></a>
	</div>
	
	<script type="text/javascript">
		var v_SVG = d3.select("body").select("svg")
		.on("contextmenu" ,function()
		{
			if ( v_ClickTable != "" )
			{
				tableNameOnMouseout(v_ClickTable);
				v_ClickTable = "";
			}
			if ( v_ClickXSQL != "" )
			{
				xsqlOnMouseout(v_ClickXSQL);
				v_ClickXSQL = "";
			}
		});

		
		
		/**
		 * 从P1点到P2点绘制柔性连接线
		 *
		 * i_P1      点1的XY坐标，如[x ,y]
		 * i_P2      点2的XY坐标，如[x ,y]
		 *
		 * ZhengWei(HY) Add 2019-06-10
		 */
		function drawLink(i_P1 ,i_P2)
		{
			var v_Width = i_P2[0] - i_P1[0];
			
			/* 降低绘制 */
			if ( i_P1[1] < i_P2[1] )
			{
				var v_C1 = [i_P1[0] + v_Width / 2 ,i_P1[1]];
				var v_C2 = [i_P1[0] + v_Width / 2 ,i_P2[1]];
				var v_C3 = [i_P2[0] ,i_P2[1]];
				
				return "M" + i_P1[0] + "," +  i_P1[1] + " "
				     + "C" + v_C1[0] + "," +  v_C1[1] + " "
				     +       v_C2[0] + "," +  v_C2[1] + " "
				     +       v_C3[0] + "," +  v_C3[1] + " ";
			}
			/* 抬高绘制 */
			else if ( i_P1[1] > i_P2[1] )
			{
				var v_C1 = [i_P1[0] + v_Width / 2 ,i_P1[1]];
				var v_C2 = [i_P1[0] + v_Width / 2 ,i_P2[1]];
				var v_C3 = [i_P2[0] ,i_P2[1]];
				
				return "M" + i_P1[0] + "," +  i_P1[1] + " "
				     + "C" + v_C1[0] + "," +  v_C1[1] + " "
				     +       v_C2[0] + "," +  v_C2[1] + " "
				     +       v_C3[0] + "," +  v_C3[1] + " ";
			}
			/* 平行线 */
			else
			{
				return "M" + i_P1[0] + "," +  i_P1[1] + " "
					 + "L" + i_P2[0] + "," +  i_P2[1] ;
			}
		}
		
		
		
		var v_Colors      = {blockColor:      "black"
				            ,xsqlQuerySelect: "#28A745"
				            ,xsqlExecSelect:  "#FF6347"
				            ,textColor:       "#BFBFBF"
				            ,textSelectColor: "white"
				            ,selectColor:     "#0DA4D3"
				            ,linkColor:       "#E5E5E5"};
		var v_BlockWidth  = 300;
		var v_BlockHeight = 18;
		var v_BlockSpace  = 1;
		var v_LeftX       = 50;
		var v_RightX      = 1280 - v_BlockWidth - 50;
		var v_FontSize    = 12;
		var v_LinkSize    = 1;
		var v_LinkSelSize = 3;
		var v_OrderType   = 2;
		var v_DSGID       = "DSG_02";
		var v_DSGs        = ["DSG_01" ,"DSG_02"];
		var v_Tables      = [{tableName:"A1234567890K" ,xsqls:["XSQL_001" ,"XSQL_002"]}
		                    ,{tableName:"B1234567890J" ,xsqls:["XSQL_001" ,"XSQL_002"]}
		                    ,{tableName:"C1234567890I" ,xsqls:["XSQL_001" ,"XSQL_002"]}
		                    ,{tableName:"D1234567890H" ,xsqls:["XSQL_003" ,"XSQL_004"]}
		                    ,{tableName:"E1234567890G" ,xsqls:["XSQL_005" ,"XSQL_006"]}
		                    ,{tableName:"F1234567890E" ,xsqls:["XSQL_007" ,"XSQL_008"]}
		                    ,{tableName:"G1234567890F" ,xsqls:["XSQL_009" ,"XSQL_003"]}
		                    ,{tableName:"H1234567890D" ,xsqls:["XSQL_001" ,"XSQL_002"]}
		                    ,{tableName:"I1234567890C" ,xsqls:["XSQL_001" ,"XSQL_002"]}
		                    ,{tableName:"J1234567890B" ,xsqls:["XSQL_001" ,"XSQL_002"]}
		                    ,{tableName:"K1234567890A" ,xsqls:[]}];
		var v_XSQLs       = [{xsql:"XSQL_001" ,type:1}
							,{xsql:"XSQL_002" ,type:2}
							,{xsql:"XSQL_003" ,type:1}
							,{xsql:"XSQL_004" ,type:2}
							,{xsql:"XSQL_005" ,type:1}
							,{xsql:"XSQL_006" ,type:2}
							,{xsql:"XSQL_007" ,type:1}
							,{xsql:"XSQL_008" ,type:2}
							,{xsql:"XSQL_009" ,type:1}
							,{xsql:"XSQL_010234567890123456789012345678901234567890" ,type:0}];
		var v_TableRefs   = {};   /* 格式如，{"表名称":["XSQLID01" ,"XSQLID02"]} */
		var v_XSQLRefs    = {};   /* 格式如，{"XSQLID":["表名称01" ,"表名称02"]} */
		var v_XSQLIndexes = {};   /* 格式如，{"XSQLID01":位置索引} */
		var v_ClickTable  = "";
		var v_ClickXSQL   = "";
		var v_FilterTable = "";
		var v_FilterXSQL  = "";
		
		
		
		v_SVG.attr("height" ,(v_Tables.length >= v_XSQLs.length ? v_Tables.length : v_XSQLs.length) * (v_BlockHeight + v_BlockSpace) + 100);
		
		
		
		$("#OrderType").val(v_OrderType);
		$("#OrderType").change(function (data) 
		{
			v_OrderType = $("#OrderType option:selected").attr("value");
	        window.location.href = "analyseObject?dsgid=" + v_DSGID + "&S=" + v_OrderType;
	    });
		
		
		
		for (var i=0; i<v_DSGs.length; i++)
		{
			if ( v_DSGs[i] == v_DSGID )
			{
				$("#DSGIDs").append("<option value='" + v_DSGs[i] + "' selected>" + v_DSGs[i] + "</option>");
			}
			else
			{
				$("#DSGIDs").append("<option value='" + v_DSGs[i] + "'>" + v_DSGs[i] + "</option>");
			}
		}
		
		$("#DSGIDs").change(function (data) 
		{
	        var v_DSGID = $("#DSGIDs option:selected").attr("value");
	        window.location.href = "analyseObject?dsgid=" + v_DSGID + "&S=" + v_OrderType;
	    });
		
		
		
		$("#helpMe").click(function (data)
		{
			alert("1 锁定关系线：点击表名称或XSQL\n2 解锁关系线：再次点击表名称、XSQL或右击\n3 红色关系线：写入数据的XSQL\n4 绿色关系线：查询数据的XSQL\n5 蓝色关系线：其它操作的XSQL，如创建对象、批量SQL等");
		});
		
		
		
		/**
		 * 获取XSQL的选择中时的颜色
		 *
		 * i_Type  XSQL的类型
		 *
		 * ZhengWei(HY) Add 2019-06-11
		 */
		function getXSQLColor(i_Type)
		{
			if ( i_Type == 1 )
			{
				return v_Colors.xsqlQuerySelect;
			}
			else if ( i_Type > 1 )
			{
				return v_Colors.xsqlExecSelect;
			}
			else
			{
				return v_Colors.selectColor;
			}
		}
		
		
		
		/**
		 * 表名称及块的鼠标划动事件
		 *
		 * i_TableName  表名称
		 *
		 * ZhengWei(HY) Add 2019-06-10
		 */
		function tableNameOnMouseover(i_TableName)
		{
			d3.select("#leftBlock_"     + i_TableName).attr("fill" ,v_Colors.selectColor);
			d3.select("#leftBlockText_" + i_TableName).attr("fill" ,v_Colors.textSelectColor);
			
			/* Link删除后重新添加 */
			var v_NewLinks = [];
			var v_NewXSQLs = [];
			d3.selectAll(".link_" + i_TableName)
			.each(function()
			{
				v_NewLinks.push(d3.select(this).attr("d"));	
				v_NewXSQLs.push(d3.select(this).attr("data-xsql"));
			});
			d3.selectAll(".link_" + i_TableName).remove();
			
			for (var i=0; i<v_NewLinks.length; i++)
			{
				var v_Type = d3.select("#rightBlock_" + v_NewXSQLs[i]).attr("data-xsql-type");
				createLink(i_TableName ,v_NewXSQLs[i] ,v_NewLinks[i] ,getXSQLColor(v_Type) ,v_LinkSelSize);
			}
			
			var v_XSQLs = v_TableRefs[i_TableName];
			if ( v_XSQLs != null )
			{
				for (var i=0; i<v_XSQLs.length; i++)
				{
					var v_XSQLID = v_XSQLs[i];
					var v_Type   = d3.select("#rightBlock_" + v_XSQLID).attr("data-xsql-type");
					
					d3.select("#rightBlock_"     + v_XSQLID).attr("fill" ,getXSQLColor(v_Type));
					d3.select("#rightBlockText_" + v_XSQLID).attr("fill" ,v_Colors.textSelectColor);
				}
			}
		}
		
		
		
		/**
		 * 表名称及块的鼠标划动事件
		 *
		 * i_TableName  表名称
		 *
		 * ZhengWei(HY) Add 2019-06-10
		 */
		function tableNameOnMouseout(i_TableName)
		{
			d3.select("#leftBlock_"     + i_TableName).attr("fill"   ,v_Colors.blockColor);
			d3.select("#leftBlockText_" + i_TableName).attr("fill"   ,v_Colors.textColor);
			d3.selectAll(".link_"       + i_TableName).attr("stroke" ,v_Colors.linkColor).attr("stroke-width" ,v_LinkSize);
			
			var v_XSQLs = v_TableRefs[i_TableName];
			if ( v_XSQLs != null )
			{
				for (var i=0; i<v_XSQLs.length; i++)
				{
					var v_XSQLID = v_XSQLs[i];
					
					d3.select("#rightBlock_"     + v_XSQLID).attr("fill" ,v_Colors.blockColor);
					d3.select("#rightBlockText_" + v_XSQLID).attr("fill" ,v_Colors.textColor);
				}
			}
		}
		
		
		
		/**
		 * XSQL ID及块的鼠标划动事件
		 *
		 * i_XSQL  XSQL的ID标识
		 *
		 * ZhengWei(HY) Add 2019-06-11
		 */
		function xsqlOnMouseover(i_XSQL)
		{
			var v_Type = d3.select("#rightBlock_" + i_XSQL).attr("data-xsql-type");
			d3.select("#rightBlock_"     + i_XSQL).attr("fill" ,getXSQLColor(v_Type));
			d3.select("#rightBlockText_" + i_XSQL).attr("fill" ,v_Colors.textSelectColor);
			
			var v_Tables = v_XSQLRefs[i_XSQL];
			if ( v_Tables != null )
			{
				for (var i=0; i<v_Tables.length; i++)
				{
					var v_TableName = v_Tables[i];
					
					d3.select("#leftBlock_"     + v_TableName).attr("fill" ,v_Colors.selectColor);
					d3.select("#leftBlockText_" + v_TableName).attr("fill" ,v_Colors.textSelectColor);
					
					d3.selectAll(".link_" + v_TableName)
					.each(function()
					{
						var v_XSQLLink = d3.select(this).attr("data-xsql");
						
						if ( i_XSQL == v_XSQLLink )
						{
							var v_D = d3.select(this).attr("d");
							d3.select(this).remove();
							
							createLink(v_TableName ,v_XSQLLink ,v_D ,getXSQLColor(v_Type) ,v_LinkSelSize);
						}
					});
				}
			}
		}
		
		
		
		/**
		 * XSQL ID及块的鼠标划动事件
		 *
		 * i_XSQL  XSQL的ID标识
		 *
		 * ZhengWei(HY) Add 2019-06-11
		 */
		function xsqlOnMouseout(i_XSQL)
		{
			var v_Type = d3.select("#rightBlock_" + i_XSQL).attr("data-xsql-type");
			d3.select("#rightBlock_"     + i_XSQL).attr("fill" ,v_Colors.blockColor);
			d3.select("#rightBlockText_" + i_XSQL).attr("fill" ,v_Colors.textColor);
			
			var v_Tables = v_XSQLRefs[i_XSQL];
			if ( v_Tables != null )
			{
				for (var i=0; i<v_Tables.length; i++)
				{
					var v_TableName = v_Tables[i];
					
					tableNameOnMouseout(v_TableName);
				}
			}
		}
		
		
		
		/**
		 * 绘制一个Link
		 *
		 * i_TableName  表名称
		 * i_XSQL       XSQL的ID标识
		 * i_D          绘制数据
		 * i_Color      Link的颜色
		 * i_LinkSize   Link的大小
		 *
		 * ZhengWei(HY) Add 2019-06-11
		 */
		function createLink(i_TableName ,i_XSQL ,i_D ,i_Color ,i_LinkSize)
		{
			v_SVG.append("path")
			.attr("class" ,"link_" + i_TableName)
			.attr("data-xsql" ,i_XSQL)
			.attr("fill" ,"none")
			.attr("stroke" ,i_Color)
			.attr("stroke-width" ,i_LinkSize)
			.attr("d" ,i_D);
		}
		
		
		
		function draw()
		{
			v_SVG.selectAll("rect").remove();
			v_SVG.selectAll("text").remove();
			v_SVG.selectAll("path").remove();
			
			v_TableRefs   = {};
			v_XSQLRefs    = {};
			v_XSQLIndexes = {};
		
			
			/* 绘制表的矩形块 */
			v_SVG.selectAll(".leftBlock").data(v_Tables).enter()
			.filter(function(d ,i)
			{
				if ( v_FilterTable == null || v_FilterTable == "" || d.tableName.toUpperCase().indexOf(v_FilterTable) >= 0 )
				{
					if ( v_FilterXSQL == null || v_FilterXSQL == "" )
					{
						return true;
					}
					
					for (var x=0; x<d.xsqls.length; x++)
					{
						if ( d.xsqls[x].toUpperCase().indexOf(v_FilterXSQL) >= 0 )
						{
							return true;
						}
					}
					
					return false;
				}
				else
				{
					return false;
				}
			})
			.append("rect")
			.attr("class"  ,"leftBlock")
			.attr("id" ,function(d ,i)
			{
				v_TableRefs[d.tableName] = [];
				
				if ( d.xsqls != null )
				{
					for (var x=0; x<d.xsqls.length; x++)
					{
						if ( v_FilterXSQL == null || v_FilterXSQL == "" )
						{
							/* Nothing. */
						}
						else if ( d.xsqls[x].toUpperCase().indexOf(v_FilterXSQL) >= 0 )
						{
							/* Nothing. */
						}
						else
						{
							continue;
						}
						
						if ( v_XSQLRefs[d.xsqls[x]] == null )
						{
							v_XSQLRefs[d.xsqls[x]] = [];
						}
						
						v_XSQLRefs[d.xsqls[x]].push(d.tableName);
						v_TableRefs[d.tableName].push(d.xsqls[x]);
					}
				}
				
				return "leftBlock_" + d.tableName;	
			})
			.attr("fill"   ,v_Colors.blockColor)
			.attr("stroke" ,v_Colors.textColor)
			.attr("stroke-width" ,"1")
			.attr("width"  ,v_BlockWidth)
			.attr("height" ,v_BlockHeight)
			.attr("x" ,function(d ,i)
			{
				return v_LeftX;
			})
			.attr("y" ,function(d ,i)
			{
				return v_BlockHeight * (i + 0) + v_BlockSpace * i;
			})
			.on("mouseover" ,function(d ,i)
			{
				if ( v_ClickTable == "" && v_ClickXSQL == "" )
				{
					tableNameOnMouseover(d.tableName);
				}
			})
			.on("mouseout" ,function(d ,i)
			{
				if ( v_ClickTable == "" && v_ClickXSQL == "" )
				{
					tableNameOnMouseout(d.tableName);
				}
			})
			.on("click" ,function(d ,i)
			{
				if ( v_ClickTable == d.tableName )
				{
					tableNameOnMouseout(v_ClickTable);
					v_ClickTable = "";
					return;
				}
				if ( v_ClickTable != "" )
				{
					tableNameOnMouseout(v_ClickTable);
					v_ClickTable = "";
				}
				if ( v_ClickXSQL != "" )
				{
					xsqlOnMouseout(v_ClickXSQL);
					v_ClickXSQL = "";
				}
				
				v_ClickTable = d.tableName;
				tableNameOnMouseover(v_ClickTable);
			});
			
			
			/* 绘制表的文字 */
			v_SVG.selectAll(".leftBlockText").data(v_Tables).enter()
			.filter(function(d ,i)
			{
				if ( v_FilterTable == null || v_FilterTable == "" || d.tableName.toUpperCase().indexOf(v_FilterTable) >= 0 )
				{
					if ( v_FilterXSQL == null || v_FilterXSQL == "" )
					{
						return true;
					}
					
					for (var x=0; x<d.xsqls.length; x++)
					{
						if ( d.xsqls[x].toUpperCase().indexOf(v_FilterXSQL) >= 0 )
						{
							return true;
						}
					}
					
					return false;
				}
				else
				{
					return false;
				}
			})
			.append("text")
			.attr("class" ,"leftBlockText")
			.attr("id" ,function(d ,i)
			{
				return "leftBlockText_" + d.tableName;	
			})
			.attr("fill" ,v_Colors.textColor)
			.attr("x" ,function(d ,i)
			{
				return 60;
			})
			.attr("y" ,function(d ,i)
			{
				return v_BlockHeight * (i + 1) + v_BlockSpace * i;
			})
			.attr("dy" ,"-4")
	      	.attr("font-size" ,v_FontSize)
			.text(function(d ,i)
			{
				return d.tableName;
			})
			.on("mouseover" ,function(d ,i)
			{
				if ( v_ClickTable == "" && v_ClickXSQL == "" )
				{
					tableNameOnMouseover(d.tableName);
				}
			})
			.on("mouseout" ,function(d ,i)
			{
				if ( v_ClickTable == "" && v_ClickXSQL == "" )
				{
					tableNameOnMouseout(d.tableName);
				}
			})
			.on("click" ,function(d ,i)
			{
				if ( v_ClickTable == d.tableName )
				{
					tableNameOnMouseout(v_ClickTable);
					v_ClickTable = "";
					return;
				}
				if ( v_ClickTable != "" )
				{
					tableNameOnMouseout(v_ClickTable);
					v_ClickTable = "";
				}
				if ( v_ClickXSQL != "" )
				{
					xsqlOnMouseout(v_ClickXSQL);
					v_ClickXSQL = "";
				}
				
				v_ClickTable = d.tableName;
				tableNameOnMouseover(v_ClickTable);
			});
			
			
			
			/* 绘制XSQL的矩形块 */
			v_SVG.selectAll(".rightBlock").data(v_XSQLs).enter()
			.filter(function(d ,i)
			{
				if ( v_FilterXSQL == null || v_FilterXSQL == "" || d.xsql.toUpperCase().indexOf(v_FilterXSQL) >= 0 )
				{
					return v_XSQLRefs[d.xsql] != null;
				}
				else
				{
					return false;
				}
			})
			.append("rect")
			.attr("class"  ,"rightBlock")
			.attr("id" ,function(d ,i)
			{
				v_XSQLIndexes[d.xsql] = i;
				return "rightBlock_" + d.xsql;	
			})
			.attr("data-xsql-type" ,function(d ,i)
			{
				return d.type;
			})
			.attr("fill" ,v_Colors.blockColor)
			.attr("stroke" ,v_Colors.textColor)
			.attr("stroke-width" ,"1")
			.attr("width"  ,v_BlockWidth * 2)
			.attr("height" ,v_BlockHeight)
			.attr("x" ,function(d ,i)
			{
				return v_RightX;
			})
			.attr("y" ,function(d ,i)
			{
				return v_BlockHeight * (i + 0) + v_BlockSpace * i;
			})
			.on("mouseover" ,function(d ,i)
			{
				if ( v_ClickTable == "" && v_ClickXSQL == "" )
				{
					xsqlOnMouseover(d.xsql);
				}
			})
			.on("mouseout" ,function(d ,i)
			{
				if ( v_ClickTable == "" && v_ClickXSQL == "" )
				{
					xsqlOnMouseout(d.xsql);
				}
			})
			.on("click" ,function(d ,i)
			{
				if ( v_ClickXSQL == d.xsql )
				{
					xsqlOnMouseout(v_ClickXSQL);
					v_ClickXSQL = "";
					return;
				}
				if ( v_ClickTable != "" )
				{
					tableNameOnMouseout(v_ClickTable);
					v_ClickTable = "";
				}
				if ( v_ClickXSQL != "" )
				{
					xsqlOnMouseout(v_ClickXSQL);
					v_ClickXSQL = "";
				}
				
				v_ClickXSQL = d.xsql;
				xsqlOnMouseover(v_ClickXSQL);
			});
			
			
			/* 绘制XSQL的文字 */
			v_SVG.selectAll(".rightBlockText").data(v_XSQLs).enter()
			.filter(function(d ,i)
			{
				if ( v_FilterXSQL == null || v_FilterXSQL == "" || d.xsql.toUpperCase().indexOf(v_FilterXSQL) >= 0 )
				{
					return v_XSQLRefs[d.xsql] != null;
				}
				else
				{
					return false;
				}
			})
			.append("text")
			.attr("class" ,"rightBlockText")
			.attr("id" ,function(d ,i)
			{
				return "rightBlockText_" + d.xsql;	
			})
			.attr("data-xsql-type" ,function(d ,i)
			{
				return d.type;
			})
			.attr("fill" ,v_Colors.textColor)
			.attr("x" ,function(d ,i)
			{
				return v_RightX + 10;
			})
			.attr("y" ,function(d ,i)
			{
				return v_BlockHeight * (i + 1) + v_BlockSpace * i;
			})
			.attr("dy" ,"-4")
	      	.attr("font-size" ,v_FontSize)
			.text(function(d ,i)
			{
				return d.xsql;
			})
			.on("mouseover" ,function(d ,i)
			{
				if ( v_ClickTable == "" && v_ClickXSQL == "" )
				{
					xsqlOnMouseover(d.xsql);
				}
			})
			.on("mouseout" ,function(d ,i)
			{
				if ( v_ClickTable == "" && v_ClickXSQL == "" )
				{
					xsqlOnMouseout(d.xsql);
				}
			})
			.on("click" ,function(d ,i)
			{
				if ( v_ClickXSQL == d.xsql )
				{
					xsqlOnMouseout(v_ClickXSQL);
					v_ClickXSQL = "";
					return;
				}
				if ( v_ClickTable != "" )
				{
					tableNameOnMouseout(v_ClickTable);
					v_ClickTable = "";
				}
				if ( v_ClickXSQL != "" )
				{
					xsqlOnMouseout(v_ClickXSQL);
					v_ClickXSQL = "";
				}
				
				v_ClickXSQL = d.xsql;
				xsqlOnMouseover(v_ClickXSQL);
			});
			
			
			/* 绘制所有Link */
			var v_TableIndex = 0;
			for (var i=0; i<v_Tables.length; i++)
			{
				if (  v_Tables[i].xsqls != null )
				{
					if ( v_FilterTable == null || v_FilterTable == "" || v_Tables[i].tableName.toUpperCase().indexOf(v_FilterTable) >= 0 )
					{
						if ( v_FilterXSQL == null || v_FilterXSQL == "" )
						{
							/* Nothing. */
						}
						else
						{
							var v_IsRef = false;
							for (var x=0; x<v_Tables[i].xsqls.length; x++)
							{
								if ( v_Tables[i].xsqls[x].toUpperCase().indexOf(v_FilterXSQL) >= 0 )
								{
									v_IsRef = true;
									break;
								}
							}
							
							if ( !v_IsRef )
							{
								continue;
							}
						}
					}
					else
					{
						continue;
					}
					
					var v_P1 = [v_LeftX + v_BlockWidth ,v_BlockHeight * (v_TableIndex + 0) + v_BlockSpace * v_TableIndex + v_BlockHeight / 2];
					v_TableIndex++;
					
					for (var x=0; x<v_Tables[i].xsqls.length; x++)
					{
						var v_XSQL      = v_Tables[i].xsqls[x];
						var v_XSQLIndex = v_XSQLIndexes[v_XSQL];
						var v_P2        = [v_RightX ,v_BlockHeight * (v_XSQLIndex + 0) + v_BlockSpace * v_XSQLIndex + v_BlockHeight / 2];
						
						if ( v_FilterXSQL == null || v_FilterXSQL == "" || v_XSQL.toUpperCase().indexOf(v_FilterXSQL) >= 0 )
						{
							if ( v_XSQLRefs[v_XSQL] == null )
							{
								continue;
							}
						}
						else
						{
							continue;
						}
						
						createLink(v_Tables[i].tableName ,v_XSQL ,drawLink(v_P1 ,v_P2) ,v_Colors.linkColor ,v_LinkSize);
					}
				}
			}
		}
		
		
		
		/**
		 * 过滤表名称
		 *
		 * ZhengWei(HY) Add 2019-06-12
		 */
		function filterTableOnKeyUp(event)
		{
			var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode;
	   		if ( keyCode == 13 ) 
			{
	   			v_FilterTable = $("#filterTable").val().toUpperCase();
	   			v_FilterXSQL  = $("#filterXSQL") .val().toUpperCase();
	   			draw();
			}
		}
		
		
		
		/**
		 * 过滤XSQL
		 *
		 * ZhengWei(HY) Add 2019-06-12
		 */
		function filterXSQLOnKeyUp(event)
		{
			var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode;
	   		if ( keyCode == 13 ) 
			{
	   			v_FilterTable = $("#filterTable").val().toUpperCase();
	   			v_FilterXSQL  = $("#filterXSQL") .val().toUpperCase();
	   			draw();
			}
		}
		
		
		
		draw();
		$("#filterTable").val("");
		$("#filterXSQL") .val("");
		v_FilterTable = "";
		v_FilterXSQL  = "";
		
	</script>

</body>
</html>